<!doctype html>
<html>
<head>
    <title>Kendo UI Examples</title>

    <style>
        html, body, ul {
            margin: 0;
            padding: 0;
        }

        a {
            color: #a2441c;
        }

        a:hover {
            color: #ef652a;
        }

        html {
            font: 75% arial,helvetica,sans-serif;
            background: #333;
        }

        #page {
            background: #fff;
            width: 56em;
            margin: 0 auto;
            box-shadow: 0 0 6px #aaa;
            border: solid #666;
            border-width: 0 1px;
            padding: 1em 3em;
        }

        ul {
            list-style-type: none;
            padding-left: 2em;
        }

        li {
            padding: .2em 0;
        }
    </style>
</head>
<body>
    <div id="page">
    
        <h1>Framework</h1>

        <ul>
        
            <li>
                <h2>DataSource</h2>
                <ul>
                
                    <li><a href='datasource/index.html'>Basic usage</a></li>
                
                    <li><a href='datasource/remote-data.html'>Binding to remote data</a></li>
                
                    <li><a href='datasource/xml-data.html'>Binding to XML</a></li>
                
                    <li><a href='datasource/remote-operations.html'>Remote data operations</a></li>
                
                    <li><a href='datasource/local-operations.html'>Local data operations</a></li>
                
                </ul>

            </li>
        
            <li>
                <h2>Templates</h2>
                <ul>
                
                    <li><a href='templates/index.html'>Basic usage</a></li>
                
                    <li><a href='templates/expressions.html'>Expressions</a></li>
                
                </ul>

            </li>
        
            <li>
                <h2>Drag & Drop</h2>
                <ul>
                
                    <li><a href='dragdrop/index.html'>Basic usage</a></li>
                
                    <li><a href='dragdrop/events.html'>Events</a></li>
                
                </ul>

            </li>
        
        </ul>
    
        <h1>Widgets</h1>

        <ul>
        
            <li>
                <h2>Overview</h2>
                <ul>
                
                    <li><a href='overview/index.html'>First look</a></li>
                
                </ul>

            </li>
        
            <li>
                <h2>AutoComplete</h2>
                <ul>
                
                    <li><a href='autocomplete/index.html'>Basic usage</a></li>
                
                    <li><a href='autocomplete/remotedatasource.html'>Binding to remote data</a></li>
                
                    <li><a href='autocomplete/template.html'>Customizing templates</a></li>
                
                    <li><a href='autocomplete/events.html'>Events</a></li>
                
                    <li><a href='autocomplete/api.html'>API</a></li>
                
                </ul>

            </li>
        
            <li>
                <h2>Calendar</h2>
                <ul>
                
                    <li><a href='calendar/index.html'>Basic usage</a></li>
                
                    <li><a href='calendar/template.html'>Customizing templates</a></li>
                
                    <li><a href='calendar/events.html'>Events</a></li>
                
                    <li><a href='calendar/api.html'>API</a></li>
                
                </ul>

            </li>
        
            <li>
                <h2>Chart</h2>
                <ul>
                
                    <li><a href='chart/index.html'>Basic usage</a></li>
                
                    <li><a href='chart/pie-chart.html'>Pie Chart</a></li>
                
                    <li><a href='chart/local-data.html'>Binding to local data</a></li>
                
                    <li><a href='chart/remote-data.html'>Binding to remote data</a></li>
                
                    <li><a href='chart/events.html'>Events</a></li>
                
                    <li><a href='chart/api.html'>API</a></li>
                
                </ul>

            </li>
        
            <li>
                <h2>ComboBox</h2>
                <ul>
                
                    <li><a href='combobox/index.html'>Basic usage</a></li>
                
                    <li><a href='combobox/remotedatasource.html'>Binding to remote data</a></li>
                
                    <li><a href='combobox/template.html'>Customizing templates</a></li>
                
                    <li><a href='combobox/events.html'>Events</a></li>
                
                    <li><a href='combobox/api.html'>API</a></li>
                
                </ul>

            </li>
        
            <li>
                <h2>DatePicker</h2>
                <ul>
                
                    <li><a href='datepicker/index.html'>Basic usage</a></li>
                
                    <li><a href='datepicker/monthpicker.html'>Month picker</a></li>
                
                    <li><a href='datepicker/rangeselection.html'>Range selection</a></li>
                
                    <li><a href='datepicker/events.html'>Events</a></li>
                
                    <li><a href='datepicker/api.html'>API</a></li>
                
                </ul>

            </li>
        
            <li>
                <h2>DropDownList</h2>
                <ul>
                
                    <li><a href='dropdownlist/index.html'>Basic usage</a></li>
                
                    <li><a href='dropdownlist/remotedatasource.html'>Binding to remote data</a></li>
                
                    <li><a href='dropdownlist/template.html'>Customizing templates</a></li>
                
                    <li><a href='dropdownlist/events.html'>Events</a></li>
                
                    <li><a href='dropdownlist/api.html'>API</a></li>
                
                </ul>

            </li>
        
            <li>
                <h2>Grid</h2>
                <ul>
                
                    <li><a href='grid/index.html'>Basic usage</a></li>
                
                    <li><a href='grid/from-table.html'>Initialization from table</a></li>
                
                    <li><a href='grid/local-data.html'>Binding to local data</a></li>
                
                    <li><a href='grid/remote-data.html'>Binding to remote data</a></li>
                
                    <li><a href='grid/virtualization-local-data.html'>Virtualization of local data</a></li>
                
                    <li><a href='grid/virtualization-remote-data.html'>Virtualization of remote data</a></li>
                
                    <li><a href='grid/sorting.html'>Sorting</a></li>
                
                    <li><a href='grid/selection.html'>Selection</a></li>
                
                    <li><a href='grid/rowtemplate.html'>Row template</a></li>
                
                    <li><a href='grid/events.html'>Events</a></li>
                
                    <li><a href='grid/api.html'>API</a></li>
                
                </ul>

            </li>
        
            <li>
                <h2>Menu</h2>
                <ul>
                
                    <li><a href='menu/index.html'>Basic usage</a></li>
                
                    <li><a href='menu/animation.html'>Animation effects</a></li>
                
                    <li><a href='menu/events.html'>Events</a></li>
                
                    <li><a href='menu/api.html'>API</a></li>
                
                </ul>

            </li>
        
            <li>
                <h2>PanelBar</h2>
                <ul>
                
                    <li><a href='panelbar/index.html'>Basic usage</a></li>
                
                    <li><a href='panelbar/ajax.html'>Loading content with AJAX</a></li>
                
                    <li><a href='panelbar/animation.html'>Animation effects</a></li>
                
                    <li><a href='panelbar/events.html'>Events</a></li>
                
                    <li><a href='panelbar/api.html'>API</a></li>
                
                </ul>

            </li>
        
            <li>
                <h2>Slider</h2>
                <ul>
                
                    <li><a href='slider/index.html'>Basic usage</a></li>
                
                    <li><a href='slider/events.html'>Events</a></li>
                
                    <li><a href='slider/api.html'>API</a></li>
                
                </ul>

            </li>
        
            <li>
                <h2>Splitter</h2>
                <ul>
                
                    <li><a href='splitter/index.html'>Basic usage</a></li>
                
                    <li><a href='splitter/ajax.html'>Loading content with AJAX</a></li>
                
                    <li><a href='splitter/events.html'>Events</a></li>
                
                    <li><a href='splitter/api.html'>API</a></li>
                
                </ul>

            </li>
        
            <li>
                <h2>TabStrip</h2>
                <ul>
                
                    <li><a href='tabstrip/index.html'>Basic usage</a></li>
                
                    <li><a href='tabstrip/ajax.html'>Loading content with AJAX</a></li>
                
                    <li><a href='tabstrip/animation.html'>Animation effects</a></li>
                
                    <li><a href='tabstrip/events.html'>Events</a></li>
                
                    <li><a href='tabstrip/api.html'>API</a></li>
                
                </ul>

            </li>
        
            <li>
                <h2>TreeView</h2>
                <ul>
                
                    <li><a href='treeview/index.html'>Basic usage</a></li>
                
                    <li><a href='treeview/dragdrop.html'>Drag & drop</a></li>
                
                    <li><a href='treeview/events.html'>Events</a></li>
                
                    <li><a href='treeview/api.html'>API</a></li>
                
                </ul>

            </li>
        
            <li>
                <h2>Upload</h2>
                <ul>
                
                    <li><a href='upload/index.html'>Basic usage</a></li>
                
                    <li><a href='upload/async.html'>Asynchronous Upload</a></li>
                
                    <li><a href='upload/events.html'>Events</a></li>
                
                    <li><a href='upload/api.html'>API</a></li>
                
                </ul>

            </li>
        
            <li>
                <h2>Window</h2>
                <ul>
                
                    <li><a href='window/index.html'>Basic usage</a></li>
                
                    <li><a href='window/ajax.html'>Loading content with AJAX</a></li>
                
                    <li><a href='window/events.html'>Events</a></li>
                
                    <li><a href='window/api.html'>API</a></li>
                
                </ul>

            </li>
        
        </ul>
    
        <h1>Integration</h1>

        <ul>
        
            <li>
                <h2>Integration</h2>
                <ul>
                
                    <li><a href='integration/index.html'>Using KnockoutJS with Kendo</a></li>
                
                    <li><a href='integration/jquery-templates.html'>Using jQuery templates with Kendo</a></li>
                
                </ul>

            </li>
        
        </ul>
    
    </div>
</body>
</html>
